//渲染侧边栏

import React from 'react';
import { Layout, Menu } from 'antd';
import IconFont from '../../component/logo';
import { NavLink } from 'react-router-dom';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
const { SubMenu } = Menu;
const { Sider } = Layout;
const icons = {
  shouYe: 'icon-icon4',
  shangPin: 'icon-shangpin',
  SPGuanLi: 'icon-shangpinguanli',
  FLGuanLi: 'icon-bumenguanli',
  SPBiaoQian: 'icon-shangpinbiaoqian',
  SPPingLun: 'icon-pinglun',
  cuXiao: 'icon-iconfontzhizuobiaozhun02100',
  YouHuiJuan: 'icon-youhuiquanguanli',
  XSMiaoSha: 'icon-xianshimiaosha',
  chouJiang: 'icon-bhjaward',
  ZhuLi: 'icon-huodong',
  KJGuanLi: 'icon-qiaquanguanli',
  dingDan: 'icon-icon',
  DDLieBiao: 'icon-dingdanliebiao',
  TGLieBiao: 'icon-tuangou',
  FHDLieBiao: 'icon-fahuodanorder',
  THDLieBiao: 'icon-tuihuo',
  PLFaHuo: 'icon-batch01',
  wangZhan: 'icon-pinglun',
  WZLieBiao: 'icon-navicon-wzgl',
  WZFenLei: 'icon-wenzhangfenlei',
  GGLieBiao: 'icon-guanggaoguanli',
  huiYuan: 'icon-huiyuan',
  HYGuanLI: 'icon-huiyuanguanli',
  HYDengJI: 'icon-huiyuandengji',
  QDGuanLI: 'icon-qiandaoguanli',
  //社区管理
  hehuoren: 'icon-hehuoren',
  quanxian: 'icon-quanxian',
  guanliyuan_guanliyuanliebiao: 'icon-guanliyuan_guanliyuanliebiao',
  rizhi: 'icon-rizhi',
  setting: 'icon-caidan',
  shangdianshezhichenggong: 'icon-shangdianshezhichenggong',
  caidanguanli: 'icon-caidanguanli',
  dingdanzhifufangshi: 'icon-dingdanzhifufangshi',
  peisongfangshiicon: 'icon-peisongfangshiicon',
  quyu: 'icon-quyu',
  mendianliebiao: 'icon-mendianliebiao',
  gongzhonghao: 'icon-gongzhonghao',
  weixinshezhi: 'icon-weixinshezhi',
  WeiXIncaidanguanli: 'icon-caidanguanli',
  ziduanfenleiguanli: 'icon-ziduanfenleiguanli',
  fenxiangjilu: 'icon-fenxiangjilu',
  xinxi: 'icon-xinxi',
  tongzhi: 'icon-tongzhi',

  // guanyuwomen: ,
  // shijian: ,
  // chanping: ,
  // lianxi: ,
};
@inject('lu')
@observer
class Slider extends React.Component {
  nav = list => {
    return list.map((item, i) => {
      if (item.children&&item.children!='') {
        return (
          <SubMenu collapsed='false' defaultCollapsed={true} key={item.premiereUrl} icon={<IconFont type={icons[item.premiereIcon]} />} title={item.premiereName}>
            {this.nav(item.children)}
          </SubMenu>
        );
      } else {
        return (
          <Menu.Item key={item.premiereUrl} icon={<IconFont type={icons[item.premiereIcon]} />}>
            <NavLink to={item.premiereUrl}>{item.premiereName}</NavLink>
          </Menu.Item>
        );
      }
    });
  };

  render() {
    let navList = toJS(this.props.lu.user.navUrl);
    return (
      <div style={{ width: 256 }}>
        <Menu defaultSelectedKeys={['1']} defaultOpenKeys={['sub1']} mode="inline" theme="dark">
          {this.nav(navList)}
        </Menu>
      </div>
    );
  }
}
export default Slider;
